<template>
	<view class="container" :class="'theme-'+theme">
	<view class="addTitle">
		<view class="titleDetail">
			<view class="titleLeft" >
				<image src="../../static/newh5/fanhui.png"
				class="yticon"
				style="width: 13px;height: 20px;color:black"
				@click="returnIndex()"
				></image>
			</view>
			<view class="titleCenter" >
			<b class="titleText">通知公告</b>
			</view>
			<view class="titleRight"  style="color: #269cd3;flex:1" > </view>
		</view>
		</view>
		<!-- <text>通知公告详情</text> -->
		<view class="info">
			<!-- 标题展示 -->
			<b class="title">{{content.title}}</b>
			<view class="hint">
				<text><u-icon name="clock-fill" style="margin-right: 4rpx;"></u-icon>{{content.issueDate}}</text>
				<text><u-icon name="eye-fill" style="margin-right: 4rpx;"></u-icon>{{content.pageViews}}次</text>
			</view>
			<!-- 内容展示 -->
			<view class="content" v-html="content.content"></view>
		</view>
	</view>
</template>

<script>
import {  goback } from "@/common/utils/navigateBack.js";
	import {
		isRead,
		detail,
		updatePageViews
	} from '../../api/message/message.js'
	export default {
		data() {
			return {
				id:'',
				articleType:'',
				content:{}
			}
		},
		onLoad(op){
			this.id = op.id
			this.articleType = op.articleType
			this.loadData()
			this.isRead()
			this.update()
		},
		methods: {
			loadData(){
				uni.showLoading({
					mask:true
				})
				detail({id:this.id,articleType:this.articleType}).then(res=>{
					uni.hideLoading()
					if(res.code === 0){
						this.content = res.data
					}
				}).catch(()=>{
					uni.hideLoading()
				})
			},
			returnIndex() {
				goback()
			},
			//已读
			isRead(){
				const params ={
					articleId:this.content.id
				}
				isRead(params).then(res=>{
					console.log('res',res);
				})
			},
			update(){
				updatePageViews({id:this.id}).then(res=>{

				})
			}
		}
	}
</script>

<style lang='scss'>
	.info{
		padding: 30rpx;
		display: flex;
		flex-direction: column;
		.title{
			justify-content: center;
			align-items: center;
			text-align: center;
			font-size: $font-lg;
		}
		.hint{
			color: #646464;
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin: 10rpx 0;
		}
		.content{
			font-size: $font-base;
		}
	}
</style>
